<template>
  <div  class="pfull body"  id="mainvue" v-cloak>
    <vue-danmaku v-model="danmus" :use-slot="true"  :speeds="80" :loop="true"
                 :debounce="1100"
                 :randomChannel="true"
                 :top="50"
                 :right="80"
                 style="position:absolute;left: 00px;top:20px;right: 00px;z-index: 0; height:250px;">
      <template  v-slot:dm="{ index, danmu }">
        <div style="color: #333;font-size: 16px;line-height: 24px;display: flex;
    align-items: center; "><img width="24" :src="'/res/qy'+(Math.floor(Math.random() * (4 - 1 + 1)) + 1)+'.png'" /> {{danmu.name}}这样说：{{ danmu.msg }}</div>
      </template>
    </vue-danmaku>
    <div class="login" style="z-index: 9999">
      <normal_login_sub v-if="loginType!='free'"></normal_login_sub>
      <normal_login_free v-else></normal_login_free>
    </div>
    <div class="container">
      <div style="z-index: 9999;cursor: pointer;" class="content" @click="openLink">
        鲁ICP备2021006469号-2
      </div>
    </div>
  </div>
</template>
<script>
import normal_login_sub from './normal_login_sub.vue'
import normal_login_free from './normal_login_free.vue'
import vueDanmaku from 'vue-danmaku'
export default {
  extends: elmVueBase,
  components: {
    vueDanmaku,
    normal_login_sub,
    normal_login_free
  },
  data() {
    return {
      loginType: null,
      danmus:[{name:"森诺科技",msg:"智慧办公产品为我们带来了新的生产力，促进了我们企业的高质量发展。"},
        {name:"灵动创意设计",msg:"智慧办公产品为我们企业带来了生产力提升。"},
        {name:"张博",msg:"智慧办公解决方案助力我们实现了高效协同。"},
        {name:"光影传媒",msg:"智慧办公产品显著提高了整体运营效率。"},
        {name:"张刚",msg:"智慧办公系统让我们的沟通更加顺畅，促进了团队间的紧密合作。"},
        {name:"启智教育",msg:"智慧办公工具的应用，为我们企业带来了显著的效益提升。"},
        {name:"宋建波",msg:"我们在数据处理上更加得心应手，决策更加精准高效。"},
        {name:"和润养生",msg:"让我们的市场竞争力大幅增强，赢得了更多客户的信赖。"},
        {name:"李湘平",msg:"智慧办公产品助力我们实现了业务流程的数字化，提升了服务质量。"},
        {name:"易购电子商务",msg:"智慧办公系统的引入，让我们在行业中脱颖而出，成为了领先的创新企业。"},
        {name:"赵吉升",msg:"智慧办公产品提高了工作效率,吸引了更多优秀人才加入我们。"},
        {name:"智核科技",msg:"应对市场变化，实现快速响应。"},
        {name:"影动文化",msg:"智显著提升了我们的客户满意度和忠诚度。"},
        {name:"墨韵传媒",msg:"智慧办公系统让我们能够实时掌握业务动态，做出更加明智的决策。"},
        {name:"金程金融",msg:"为我们企业带来了前所未有的发展机遇。"},
        {name:"慧芯科创",msg:"智慧办公产品让我们在数据分析和挖掘上取得了突破性进展。"},
        {name:"王铭才",msg:"让我们能够更加专注于核心业务，实现持续稳健的发展。"},
        {name:"谢世干",msg:"智慧办公产品助力我们构建了更加完善的客户服务体系，提升了品牌价值。"},
        {name:"周勇",msg:"让我们在市场竞争中占据了有利地位。"},
        {name:"李振成",msg:"提高了我们的工作效率。"},
        {name:"迅达智联科技",msg:"智慧办公让我们能够汇聚各方智慧，共同开创美好的未来。"}],
    }
  },
  async created() {
    this.loginType = 'free'
    for (let i = this.danmus.length - 1; i > 0; i--) {
      const j = Math.floor(Math.random() * (i + 1));
      [this.danmus[i], this.danmus[j]] = [this.danmus[j], this.danmus[i]]; // 使用解构赋值来交换元素
    }
  },
  methods: {
    openLink(){
      window.open("https://beian.miit.gov.cn/","_blank");
    }
  }
};
</script>

<style>
#login .el-loading-mask {
  background-color: rgba(255, 255, 255, 0) !important;
  left: 5px;
  right: 5px;
}
#login .el-input--small .el-input__inner {
  height: 38px;
  line-height: 38px;
  font-size: 16px;
}

</style>
<style scoped>
@import url('theme/login.css');

.body {
  color: #333;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 14px;
  background: url(theme/images/loginbg.jpg);
}
.container {
  height: 100vh; /* 使容器充满整个视口 */
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: flex-end;    /* 垂直对齐到页面底部 */
}

.content {
  text-align: center;  /* 让文本居中 */
  margin-bottom: 20px;  /* 根据需要调整底部间距 */
}
</style>